<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>高峰业务管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../plugins/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="../plugins/layui/css/myPage.css">
    <link rel="stylesheet" href="../css/formSelects-v4.css">
</head>
<body class="layui-layout-body">


<blockquote class="layui-elem-quote">
    <div class=" layui-form">
        <div class="layui-form-item">
            <div class="layui-input-inline" style="width: 130px">
                <label class="layui-form-label">业务类型</label>
                <label class="layui-form-label">操作时间</label>
            </div>

            <div class="layui-input-inline" id="searchContentCon">
                <select id="ywlxSearch" xm-select="ywlxSearch" xm-select-skin="normal">
                    <option value="">所有类型</option>
                    <option value="顺丰">顺丰</option>
                    <option value="邮政">邮政</option>
                    <option value="京东">京东</option>
                    <option value="其它">其它</option>
                </select>
                <input type="text" class="layui-input" id="tjsjSearch" placeholder="请选择操作时间">
            </div>

            <div class="layui-input-inline" style="width: 130px">
                <label class="layui-form-label">靠车时间</label>
                <label class="layui-form-label">出发时间</label>
            </div>

            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="kcsjSearch" placeholder="请选择靠车时间">
                <input type="text" class="layui-input" id="cfsjSearch" placeholder="请选择出发时间">
            </div>


            <div class="layui-input-inline" style="width: 130px">
                <label class="layui-form-label">区域</label>
                <label class="layui-form-label">驾驶员</label>
            </div>

            <div class="layui-input-inline">
                <div id="ydSearchContentCon">
                    <!--<input id="quyuSearch" class="ym-qatitle layui-input " placeholder="请输入区域" autocomplete="off"/>-->

                    <select class="layui-input" id="quyuSearch" lay-search>
                    <option value="">请选择</option>
                </select></div>
                <input type="text" class="layui-input" id="jsySearch" placeholder="请输入驾驶员姓名">
            </div>

            <div class="layui-input-inline" style="width: 120px">
                <label class="layui-form-label">始发地</label>
                <label class="layui-form-label">目的地</label>
            </div>

            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="sfdSearch" placeholder="请输入始发地">
                <input type="text" class="layui-input" id="mddSearch" placeholder="请输入目的地">
            </div>


            <div class="layui-input-inline" style="width: 130px">
                <button class="layui-btn layui-btn-normal" id="search" style="margin-bottom: 5px">搜索</button>
                <button class="layui-btn layui-btn-normal" id="daochu">导出</button>


            </div>
            <div class="layui-input-inline" style="width: 80px">
                <button id="new" class="layui-btn layui-btn-normal" style="margin-bottom: 5px">新增高峰业务</button>
                <button type="button" class="layui-btn layui-btn-normal" id="all">显示全部</button>


            </div>
        </div>
    </div>
</blockquote>
<div class="layui-row">
    <div class="layui-col-xs12">

        <script type="text/html" id="opera">

            {{#  if( getQueryVariable("R") == "false"){ }}
            <button class="layui-btn layui-btn-normal layui-btn-xs layui-btn-disabled" disabled lay-event="detail">查看
            </button>
            <button class="layui-btn layui-btn-danger layui-btn-xs layui-btn-disabled" disabled lay-event="del">删除
            </button>
            {{# }else{ }}
            <button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="detail">查看</button>
            {{#  if( getQueryVariable("D") == "false"){ }}
            <button class="layui-btn layui-btn-danger layui-btn-xs layui-btn-disabled" disabled lay-event="del">删除
            </button>
            {{# }else{ }}
            <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</button>
            {{# } }}
            {{# } }}

        </script>
        <table id="table" lay-filter="Table"></table>
        <div id="laypage"></div>
    </div>
</div>

<script src="../plugins/layui/layui.js"></script>
<script src="../js/config.js"></script>
<script src="../js/tools.js"></script>
<script src="../js/autocomplete.js"></script>
<script src="../js/peakarea.js"></script>
<script src="../js/formSelects-v4.js" type="text/javascript" charset="utf-8"></script>
<script type="text/html" id="ywlxfix">
    {{# if(d.ywlx == "其它"){ }}
    {{d.ywlx = d.ywqt}}
    {{#   }else{ }}
    {{d.ywlx }}
    {{# } }}
</script>
<script type="text/html" id="quyufix">
    {{# if(d.quyu == "其它"){ }}
    {{d.quyu = d.qyqt}}
    {{#   }else{ }}
    {{d.quyu }}
    {{# } }}
</script>
<script>
    //JavaScript代码区域
    layui.use(['form', 'table', 'jquery', 'layer', 'laydate', 'element', 'laypage'], function () {
        var formSelects = layui.formSelects;
        var form = layui.form;
        var table = layui.table;
        var $ = layui.$;
        var element = layui.element;
        var layer = layui.layer;
        var tableheight = 'full-200';
        var laydate = layui.laydate;
        var tablewidth = 90;
        var limitcount = 10;
        var curnum = 1;
        var laypage = layui.laypage;
        ;
        var tablehead = [[ //表头
            {type: 'numbers', title: '序号', align: 'center'}
            , {field: 'ywlx', title: '业务类型',templet:'#ywlxfix', align: 'center'}
            , {field: 'quyu', title: '区域', templet:'#quyufix',align: 'center'}
            , {field: 'kcsj', title: '靠车时间', align: 'center'}
            , {field: 'cfsj', title: '出发时间', align: 'center'}
            , {field: 'sfd', title: '始发地', align: 'center'}
            , {field: 'mdd', title: '目的地', align: 'center'}
            , {field: 'chexing', title: '车型', align: 'center'}
            , {field: 'jsy', title: '驾驶员', align: 'center'}
            , {field: 'tjsj', title: '操作时间', align: 'center'}
            , {title: '操作', align: 'center', toolbar: '#opera'}
        ]]

        laydate.render({
            elem: '#kcsjSearch' //指定元素
            , format: 'yyyy-MM-dd'
            , theme: '#0099FF'
        });

        laydate.render({
            elem: '#cfsjSearch' //指定元素
            , format: 'yyyy-MM-dd'
            , theme: '#0099FF'
        });

        laydate.render({
            elem: '#tjsjSearch' //指定元素
            , format: 'yyyy-MM-dd'
            , theme: '#0099FF'
        });

        $.ajax({
            url: contextPath+"/peakwaybilllist",
            type: "GET",
            contentType:"application/json;charset=utf-8",
            dataType:"json",
            success: function(res) {
                for (var i in res.list) {
                    var option = "<option value='" + res.list[i] + "'>" + res.list[i] + "</option>";
                    $("#quyuSearch").append(option);
                }
                form.render('select');
            }
        });

        $('#daochu').click(function () {
            var ywlxArr = layui.formSelects.value('ywlxSearch', 'val')
            var searchywlsString = ""
            for (var i = 0; i < ywlxArr.length; i++) {
                var itemString = 'yewu' + (i + 1)
                searchywlsString = searchywlsString + itemString + '=' + ywlxArr[i] + '&'
            }
            console.log(searchywlsString)
            window.location.href = contextPath + "peakexcel?" + searchywlsString + "jsy=" + $("#jsySearch").val() + "&sfd=" + $("#sfdSearch").val() + "&mdd=" + $("#mddSearch").val() + "&kcsj=" + $("#kcsjSearch").val() + "&tjsj=" + $("#tjsjSearch").val()+ "&cfsj=" + $("#cfsjSearch").val() + "&quyu=" + $("#quyuSearch").val();
        });



        form.render('select');

        peakwaybill(curnum, limitcount);

        function peakwaybill(start, limitsize) {
            layui.use(['table', 'laypage', 'laydate'], function () {
                var table = layui.table,
                    laypage = layui.laypage;
                table.render({
                    url: contextPath + "peak?pageNum=" + start + "&pageSize=" + limitsize,
                    elem: '#table',
                    height: tableheight,
                    page: false,
                    id: 'table',
                    cellMinWidth: tablewidth,
                    cols: tablehead,
                    done: function (res, curr, count) {
                        laypage.render({
                            elem: 'laypage'
                            , count: count
                            , curr: curnum
                            , limit: limitcount
                            , layout: ['prev', 'page', 'next', 'skip', 'count', 'limit']
                            , jump: function (obj, first) {
                                if (!first) {
                                    curnum = obj.curr;
                                    limitcount = obj.limit;
                                    peakwaybill(curnum, limitcount);
                                }
                            }
                        });
                    }
                });
            });
        }

        function peakwaybillsearch(start, limitsize) {
            var ywlxArr = layui.formSelects.value('ywlxSearch', 'val')
            var searchywlsString = ""
            for (var i = 0; i < ywlxArr.length; i++) {
                var itemString = 'yewu' + (i + 1)
                searchywlsString = searchywlsString + itemString + '=' + ywlxArr[i] + '&'
            }
            layui.use(['table', 'laypage', 'laydate'], function () {
                var table = layui.table,
                    laypage = layui.laypage;
                table.render({
                    url: contextPath + "peak?" + searchywlsString + "pageNum=" + start + "&pageSize=" + limitsize + "&ywlx=" + $("#ywlxSearch").val() + "&jsy=" + $("#jsySearch").val() + "&sfd=" + $("#sfdSearch").val() + "&mdd=" + $("#mddSearch").val() + "&kcsj=" + $("#kcsjSearch").val() + "&tjsj=" + $("#tjsjSearch").val() + "&cfsj=" + $("#cfsjSearch").val() + "&quyu=" + $("#quyuSearch").val(),
                    dataType: "object",
                    elem: '#table',
                    height: tableheight,
                    page: false,
                    id: 'table',
                    cellMinWidth: tablewidth,
                    cols: tablehead,
                    done: function (res, curr, count) {
                        laypage.render({
                            elem: 'laypage'
                            , count: count
                            , curr: start
                            , limit: limitsize
                            , layout: ['prev', 'page', 'next', 'skip', 'count', 'limit']
                            , jump: function (obj, first) {
                                if (!first) {
                                    curnum = obj.curr;
                                    limitcount = obj.limit;
                                    peakwaybillsearch(curnum, limitcount);
                                }
                            }
                        });
                    }
                });
            });
        }

        //刷新table实例
        $("#all").on('click', function () {
            curnum = 1;
            peakwaybill(curnum, limitcount);
        });


        table.on('tool(Table)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                , layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent === 'detail') {
                layer.open({
                    type: 2,
                    title: '查看高峰业务信息',
                    maxmin: true,
                    //点击遮罩关闭层
                    shadeClose: false,
                    area: ['80%', '80%'],
                    content: ['./lookPeakwaybill.html'],
                    success: function (layero, index) {
                        console.log(data);
                        var body = layer.getChildFrame('body', index);
                        for (var i in data) {
                            body.contents().find("[name='" + i + "']").val(eval("data." + i));
                        }
                    },
                    end: function () {
                        peakwaybillsearch(curnum, limitcount);
                    }
                });

            } else if (layEvent === 'del') {
                layer.confirm('确定删除？', function (index) {
                    layer.close(index);
                    //向服务端发送删除指令
                    $.ajax({
                        url: contextPath + "/peak/" + data.peakid,
                        type: "DELETE",
                        contentType: "application/json;charset=utf-8",
                        dataType: "json",
                        success: function (res) {
                            if (res.message == "删除成功！") {
                                obj.del(); //删除对应行（tr）的DOM结构
                            }
                            layer.msg(res.message);
                            peakwaybillsearch(curnum, limitcount);
                        }
                    });
                });
            }

        });

        $('#new').click(function () {
            layer.open({
                cancel: function (index, layero) {
                    var faIndex = index;
                    layer.confirm('确定要关闭么?未保存的信息将会丢失!', {icon: 3, title: '提示'}, function (index) {
                        //do something
                        layer.close(index);
                        layer.close(faIndex);
                    });
                    return false
                },
                type: 2,
                title: '新增高峰业务',
                maxmin: true,
                shadeClose: false, //点击遮罩关闭层
                area: ['80%', '80%'],
                content: './newPeakwaybill.html',
                end: function () {
                    peakwaybillsearch(curnum, limitcount);
                }
            });
        });

//搜索
        $("#search").on('click', function () {
            curnum = 1;
            var ywlxArr = layui.formSelects.value('ywlxSearch', 'val')
            var searchywlsString = ""
            for (var i = 0; i < ywlxArr.length; i++) {
                var itemString = 'yewu' + (i + 1)
                searchywlsString = searchywlsString + itemString + '=' + ywlxArr[i] + '&'
            }

            layui.use(['table', 'laypage', 'laydate'], function () {


                var table = layui.table,
                    laypage = layui.laypage;
                table.render({
                    url: contextPath + "peak?" + searchywlsString + "pageNum=" + curnum + "&pageSize=" + limitcount + "&jsy=" + $("#jsySearch").val() + "&sfd=" + $("#sfdSearch").val() + "&mdd=" + $("#mddSearch").val() + "&kcsj=" + $("#kcsjSearch").val() + "&tjsj=" + $("#tjsjSearch").val() + "&cfsj=" + $("#cfsjSearch").val() + "&quyu=" + $("#quyuSearch").val(),
                    dataType: "object",
                    elem: '#table',
                    height: tableheight,
                    page: false,
                    id: 'table',
                    cellMinWidth: tablewidth,
                    cols: tablehead,
                    done: function (res, curr, count) {
                        laypage.render({
                            elem: 'laypage'
                            , count: count
                            , curr: curnum
                            , limit: limitcount
                            , layout: ['prev', 'page', 'next', 'skip', 'count', 'limit']
                            , jump: function (obj, first) {
                                if (!first) {
                                    curnum = obj.curr;
                                    limitcount = obj.limit;
                                    peakwaybillsearch(curnum, limitcount);
                                }
                            }
                        });
                    }
                });
            });
        });
    });


</script>
</body>
</html>